<!--主页-->
<template>
  <div class="House">
    <div class="House_head">
      <div class="House_head_one">
        <h2>宏烨经纪人</h2>
        <p></p>
        <p>
          <van-icon name="ellipsis" />
          <van-icon name="award-o" />
        </p>
      </div>

      <div class="House_head_two"></div>
    </div>

    <div class="House_main">
      <router-link to="/home/new">新房</router-link>
      <router-link to="/home/hand">二手房</router-link>
      <router-link to="/home/rent">出租房</router-link>
    </div>

    <div class="House_footer">
      <router-link to="/home/msg"
        ><span class="icon iconfont">&#xe581;</span>消息</router-link
      >
      <router-link to="/home/seek">
        <span class="icon iconfont">&#xe603;</span>求租</router-link
      >
      <router-link to="/home/atb">
        <span class="icon iconfont">&#xe603;</span>求购</router-link
      >
      <router-link to="/home/estate"
        ><span class="icon iconfont">&#xe503;</span>楼市圈</router-link
      >
      <router-link to="/home/live"
        ><span class="icon iconfont">&#xe516;</span>直播</router-link
      >
      <router-link to="/home/group"
        ><span class="icon iconfont">&#xe604;</span>团购</router-link
      >
      <router-link to="/home/rank"
        ><span class="icon iconfont">&#xe604;</span>排行榜</router-link
      >
      <router-link to="/home/recored"
        ><span class="icon iconfont">&#xe50c;</span>战绩</router-link
      >
    </div>
  </div>
</template>

<script>
// import axios from "axios";
export default {
  // data() {
  //   return {
  //     house: [],
  //   };
  // },
  // methods: {
  //   House() {
  //     axios.get("/home").then((res) => {
  //       console.log(res);
  //       this.House = res.data.data
  //     });
  //   },
  // },
  // created() {
  //   this.House();
  // },
};
</script>

<style>
.House {
  width: 100%;
  height: 100%;
}
.House_head {
  width: 100%;
  height: 280px;
  background: #2693fa;
  position: relative;
}
.House_head_one {
  width: 100%;
  height: 50px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 10px;
  color: #fff;
}
.House_head_one p:nth-child(3) {
  border: 1px solid #e6e6e6;
  border-radius: 40px;
}
.House_head_one p:nth-child(3) .van-icon {
  padding: 4px 10px;
}
.House_main {
  width: 95%;
  height: 100px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 25px;
  position: absolute;
  left: 50%;
  top: 40%;
  transform: translate(-50%, -50%);
  border-radius: 10px;
  border: 1px solid #ccc;
  background: #fff;
}
.House_footer {
  width: 100%;
  margin-top: 100px;
  display: flex;
  flex-wrap: wrap;
  text-align: center;
}
.House_footer a {
  width: calc(100% / 3);
  height: 100px;
  line-height: 30px;
  display: flex;
  flex-direction: column;
}
</style>